import React, { useState,useEffect} from 'react';
import { useHistory } from "react-router-dom";
import {Modal, List, Tabs, Accordion, Toast, Button, ListView} from 'antd-mobile';
import './details.less';
import woman from '../../../libs/img/user/woman.png';
import http from "../../../model/http";
import Header from "../../../components/header/Header";
import NewAdd from './commponent/newAdd/index';
import man from "../../../libs/img/user/man.png";
import VIP from "../../../libs/img/user/vip.png";
import no_data from "../../../libs/img/user/no-data.png";
// import Vconsole from 'vconsole'
// const vConsole = new Vconsole()

const Item = List.Item;
const Brief = Item.Brief;
const pagesize=10
const pageType = [
    {t:'查看',p:'/user/edit?type=edit&'},
    {t:'预约',p:'/yuyue?'},
    {t:'开单',p:'/goods/order?'},
]

function Details() {
    const history = useHistory(),
        query = http.useQuery(),
        query_isBind = query.get('isBind'),
        entryIsHome = query.get('entryIsHome'),
        showHeader = query.get('showHeader'),
        outUserId = query.get('outUserId');
    // const isBind =history.location.state.isBind===0?history.location.state.isBind:query_isBind;
    const customerCrmId =history.location.state.customerCrmId;
    const [isBind,setIsBind] = useState(history.location.state.isBind===0?history.location.state.isBind:query_isBind)
    const [allInfo,setAllInfo] = useState({}) //顶部卡片客户基本信息
    const [baseInfo,setBaseInfo] = useState({}) //顶部卡片客户基本信息

    const [moreInfo,setMoreInfo] = useState({}) //客户详细资料

    const [billType,setBillType] = useState('0')
    const [saveBillInfo,setSaveBillInfo] = useState([]) //客户账单
    const [consultType,setConsultType] = useState('0') //咨询情况选择类型
    const temp =[]
   
    //tab  index
    const [tabIndex,setTabIndex] = useState([])
 



    //回访记录
    const [dataSourceFeedBack,setDataSourceFeedBack] =useState(new ListView.DataSource({
        rowHasChanged: (row1, row2) => row1 !== row2,
    }))
    const [feedbackInfo,setFeedbackInfo] = useState([])
    const [ feedbackPage,setFeedbackPage] =useState(1)
    const [ hasMoreFeedBack,setHasMoreFeedBack] =useState(true)

    //分诊记录
    const [dataSourceTriage,setDataSourceTriage] =useState(new ListView.DataSource({
        rowHasChanged: (row1, row2) => row1 !== row2,
    }))
    const [ triageInfo,setTriageInfo] = useState([])
    const [ triagePage,setTriagePage] =useState(1)
    const [ hasMoreTriage,setHasMoreTriage] =useState(true)

    //咨询情况
    const [dataSourceConsultInfo,setDataSourceConsultInfo] =useState(new ListView.DataSource({
        rowHasChanged: (row1, row2) => row1 !== row2,
    }))
    const [consultInfo,setConsultInfo] = useState([])
    const [ consultInfoPage,setConsultInfoPage] =useState(1)
    const [ hasMoreConsultInfo,setHasConsultInfo] =useState(true)


    //客户账单选择类型
    const [dataSourceBillInfo,setDataSourceBillInfo] =useState(new ListView.DataSource({
        rowHasChanged: (row1, row2) => row1 !== row2,
    }))
    const [billInfo,setBillInfo] = useState([]) //客户账单
    const [ billInfoPage,setBillInfoPage] =useState(1)
    const [ hasMoreBillInfo,setHasMoreBillInfo] =useState(true)

    /*渲染完成*/
    useEffect( ()=>{
        getCustomerDetails(customerCrmId)  //获取客户详细资料
    },[])

    //获取详细资料
    const getCustomerDetails = (customerCrmId)=>{
        http.post('/customer/customerDetail',{
            customerCrmId:customerCrmId,
        }).then(res=> {
            setBaseInfo(res.baseInfo[0])  //顶部卡片客户基本信息
            setMoreInfo(res.moreInfo[0])  //客户详细资料
        })
    }

    //获取账单详情
    const getCustomerBillInfo = (customerCrmId,page=1,items=10)=>{
        http.post('/customer/getCustomerBillInfo',{
            customerCrmId:customerCrmId,
            page:page,
            items:items
        }).then(res=> {
            console.log("账单详情",res)
            // setBillInfo(res.data)  //客户账单
            setSaveBillInfo(res.data)
            if(res?.result==0){
                const lg = res.data.length;
                let concat_arr = billInfo.concat(res.data)
                setDataSourceBillInfo(dataSourceBillInfo.cloneWithRows(concat_arr))
                setBillInfo(concat_arr)
                if(lg<10){
                    setHasMoreBillInfo(false)
                    // return ;
                }
                setBillInfoPage(billInfoPage+1)
            }else{
                Toast.fail("请求错误",1.5);
            }
        })
    }

    //获取回访记录
    const getSearchFeedBack = (customerCrmId,page=1,items=10)=>{
        http.post('/customer/searchFeedBack',{
            params:customerCrmId,
            page:page,
            items:items
        }).then(res=> {
            console.log("回访记录",res)
            // setFeedbackInfo(res.data)  //回访记录
            if(res?.result==0){
                const lg = res.data.length;
                let concat_arr = feedbackInfo.concat(res.data)
                setDataSourceFeedBack(dataSourceFeedBack.cloneWithRows(concat_arr))
                setFeedbackInfo(concat_arr)
                if(lg<10){
                    setHasMoreFeedBack(false)
                    // return ;
                }
                setFeedbackPage(feedbackPage+1)
            }else{
                Toast.fail("请求错误",1.5);
            }
        })
    }

    //获取咨询情况
    const getSearchConsultRecord = (customerCrmId,type=0,page=1,items=10)=>{
        http.post('/customer/searchConsultRecordBySourceType',{
            params:customerCrmId,
            type:type,
            page:page,
            items:items
        }).then(res=> {
            console.log("咨询情况",res.data)

            if(res?.result==0){
                const lg = res.data.length;
                let concat_arr = consultInfo.concat(res.data)
                setDataSourceConsultInfo(dataSourceConsultInfo.cloneWithRows(concat_arr))
                setConsultInfo(concat_arr)
                if(lg<10){
                    setHasConsultInfo(false)
                    // return ;
                }
                setConsultInfoPage(consultInfoPage+1)
            }else{
                Toast.fail("请求错误",1.5);
            }
        })
    }

    //点击咨询情况类型
    const selecConsult=(e)=>{
        const type =e.target.dataset.type
        setConsultType(type)
        setConsultInfoPage(1)
        http.post('/customer/searchConsultRecordBySourceType',{
            params:customerCrmId,
            type:type,
            page:1,
            items:10
        }).then(res=> {
            console.log("咨询情况",res.data)
            if(res?.result==0){
                const lg = res.data.length;
                setDataSourceConsultInfo(dataSourceConsultInfo.cloneWithRows(res.data))
                setConsultInfo(res.data)
                if(lg<10){
                    setHasConsultInfo(false)
                    // return ;
                }
                setConsultInfoPage(consultInfoPage+1)
            }else{
                Toast.fail("请求错误",1.5);
            }
        })

    }

    //获取分诊记录
    const getSearchTriage = (customerCrmId,page=1,items=10)=>{
        http.post('/customer/getCustomerReceive',{
            customerId:customerCrmId,
            page:page,
            items:items
        }).then(res=> {
            console.log("分诊记录",res)
            if(res?.result==0){
                const lg = res.data.length;
                let concat_arr = triageInfo.concat(res.data)
                setDataSourceTriage(dataSourceTriage.cloneWithRows(concat_arr))
                setTriageInfo(concat_arr)
                if(lg<10){
                    setHasMoreTriage(false)
                    // return ;
                }
                setTriagePage(triagePage+1)
            }else{
                Toast.fail("请求错误",1.5);
            }
        })
    }

    //确认绑定
    const submit= async ()=>{
        const str_user = window.localStorage.getItem('user')
        const work_user = JSON.parse(str_user)

        console.log(work_user)
        let ok  = await http.outPost('/customer/updateCustomerDetailBind',{
            crmId: work_user.managerId,
            hosId: work_user.hosId,
            userId: work_user.userid,
            customerCrmId:history.location.state.customerCrmId,
            outUserId:outUserId
        })
        console.log('绑定接口数据:',ok)
        // console.log("cccccccc",ok)
        ok.result === 0 && Toast.success( '绑定成功',1.5,function (){
            setIsBind(1)
            getCustomerDetails(customerCrmId)

            
        })
        
    }

    //点击账单类型
    const selecBill=(e)=>{
        const type =e.target.dataset.type
        // let temp_bill=allInfo.billInfo
        let temp_bill=saveBillInfo
        let temp_arr =[]
        setBillType(type)
        if(type==1){
            temp_bill.map((item,index)=>{
                if(item.bill_type ==1){
                    temp_arr.push(item)
                }
            })
            setDataSourceBillInfo(dataSourceBillInfo.cloneWithRows(temp_arr))
            setBillInfo(temp_arr)
            return
        }
        if(type==2){
            temp_bill.map((item,index)=>{
                if(item.bill_type==2){
                    temp_arr.push(item)
                }
            })
            setDataSourceBillInfo(dataSourceBillInfo.cloneWithRows(temp_arr))
            setBillInfo(temp_arr)
            return;
        }
        setDataSourceBillInfo(dataSourceBillInfo.cloneWithRows(temp_bill))
        setBillInfo(temp_bill);
    }

    //点击切换选项卡
    const onTabClick =(tab,index)=>{
        setTabIndex(index)
        if(index==1){
            console.log('分诊记录')
            // if(!hasMoreTriage) return
            getSearchTriage(customerCrmId,feedbackPage,pagesize)    //分诊记录
            // return
        }
        if(index==2){
            // if(!hasMoreConsultInfo) return
            getSearchConsultRecord(customerCrmId,consultType,consultInfoPage,pagesize) //咨询情况
            // return
        }
        if(index==3){
            // if(!hasMoreBillInfo) return
            getCustomerBillInfo(customerCrmId,billInfoPage,pagesize)  //获取账单详情
            // return
        }
        if(index==4){
            // if(!hasMoreFeedBack) return
            getSearchFeedBack(customerCrmId,feedbackPage,pagesize)    //回访记录
            // return
        }
    }

    const feedBackRow =(item, sectionID, rowID)=>{
        return(
            <div className='g-border-bt1'>
                <div className='g-flex g-y-center g-mt30'>
                    <img className='record-img' src={woman} alt=""/>
                    <div className='name g-ml15 ' style={{'fontSize':'16px'}}>{item.recorder}</div>
                </div>
                <div style={{lineHeight:'0.4rem'}} className='g-c-333 g-f32 g-mt25 g-let-spa-2'>
                    {item.scoutContent?item.scoutContent:'暂无记录'}
                </div>
                <div className='g-flex g-x-between g-y-center g-mt30 g-mb30'>
                    <div className='g-f20 g-c-999' >跟进时间：<span className='g-c-333 g-f28'>{item.recordDate}</span></div>
                    <div className='g-f20  g-c-666 '>回访方式：<span className='g-c-333 g-f28'>{item.feedBackWay}</span></div>
                </div>
            </div>
        )
    }

    //渲染分诊每一行
    const triageRow =(item, sectionID, rowID)=>{
        return(
            <div className='g-border-bt1'>
                <div className='g-flex g-y-center g-x-between g-mt30'>
                    <div className='g-flex g-y-center'>
                        <img className='record-img' src={woman} alt=""/>
                        <div className='name g-ml15 ' style={{"fontSize":'16px'}}>{item.triageConsultMan}</div>
                    </div>
                    <div className='g-c-999 g-f24'>
                        咨询项目：<span style={{color:'#50a8ff'}}>{item.receiveItemName}</span>
                    </div>
                </div>
                <div className='g-flex g-x-between g-y-center g-mt30 g-mb30'>
                    <div className='g-f20 g-c-999' >分诊时间：<span className='g-c-333 g-f26'>{item.triageDate}</span></div>
                    <div className='g-f20  g-c-666 '>咨询状态：<span className='g-c-333 g-f28'>{item.consultState}</span></div>
                </div>
            </div>
        )
    }

    const consultInfoRow =(item, sectionID, rowID)=>{
        return(
            <div className='g-border-bt'>
                    <div className='g-flex g-y-center g-x-between g-mt30'>
                        <div className='g-flex g-y-center'>
                            <img className='record-img' src={woman} alt=""/>
                            <div className='g-flex-col g-ml20'>
                                <div className='name g-mt10 g-f30 g-fw'>{item.consultMan}</div>
                                {/*{*/}
                                {/*    item.user_type==1?(<p className='g-f18 g-mt10' style={{color:'#66cccc'}}>{item.orgName}</p>)*/}
                                {/*        :(<p className='g-f18 g-mt10' style={{color:'#ffcc66'}}>{item.orgName}</p>)*/}
                                {/*}*/}
                                <p className='g-f24 g-mt10' style={{color:'#FC9C17'}}>{item.orgName}</p>
                            </div>

                        </div>
                        <div className='g-c-999 g-f24'>
                            咨询项目：<span style={{color:'#50a8ff'}}>{item.consultName}</span>
                        </div>

                    </div>
                    <div style={{lineHeight:'0.4rem'}} className='g-c-333 g-f32 g-mt25 g-let-spa-2'>
                        {item.consultCondition?item.consultCondition:'暂无内容'}
                    </div>
                    <div className='g-flex g-x-between g-y-center g-mt30 g-mb30'>
                        <div className='g-f20 g-c-999' >跟进时间：<span className='g-c-333 g-f30'>{item.consultDate}</span></div>
                        {/*<div className='g-f20  g-c-666'>成交状态：<span className='g-c-333 g-f28'>{item.sourceType}</span></div>*/}
                        {
                            item.orgName&&(
                                <div className='g-f20  g-c-666'>咨询部门：<span className='g-c-333 g-f28'>{item.orgName}</span></div>
                            )
                        }
                    </div>
                </div>
        )
    }

    const billTypeRow =(item, sectionID, rowID)=>{
        return(
            <div >
                {

                    item.bill_type == 1 ? (
                        <Accordion accordion defaultActiveKey={1}   >
                        <Accordion.Panel header={item.title}>
                            <div className='g-mt30 g-f28 g-flex'>
                                <span style={{whiteSpace: 'nowrap'}}>项目:</span>
                                <div>{item.title}</div>
                            </div>
                            <div className='g-mt30 g-f28'><span>科室:</span>{item.dept_name}</div>
                            <div className='g-mt30 g-f28'><span>成交金额:</span>{item.ok_money}</div>
                            <div className='g-mt30 g-f28'>
                                <span>营收金额:</span>
                                <span className='g-f40 g-fw' style={{color: '#007AFF'}}>{item.total_fee}</span>
                            </div>
                            <div className='g-mt30 g-f28'><span>总次数/剩余次数:</span>{item.time_info}</div>
                            <div className='g-mt30 g-mb30 g-f28'><span>成交时间:</span>{item.processed_time}</div>
                            {item?.ext_info?.map((item2, index) => {
                                    return (<div>
                                            {(item2.money || item2.time) && (
                                                <div className='g-mb30' style={{
                                                    background: '#f0f2f5',
                                                    padding: '.1rem 0.2rem .3rem',
                                                    borderRadius: '.15rem'
                                                }}>
                                                    {
                                                        item2.money && (<p className='g-mt30 g-f28'>
                                                            {item2.title_money}：<span className='g-f40 g-fw'
                                                                                      style={{color: '#007AFF'}}>{item2.money}</span>
                                                        </p>)
                                                    }
                                                    {
                                                        item2.time && (
                                                            <p className='g-mt30 g-f28'>{item2.title_time}：{item2.time}</p>)
                                                    }
                                                </div>
                                            )}</div>
                                    )
                                }
                            )}
                        </Accordion.Panel>
                        </Accordion >)
                        : (<div className='money-wrapper'>
                            <div className='g-border-bt g-f32' style={{height: '0.7rem'}}>{item.title}</div>
                            <div className='g-mt30 g-f28'><span>项目:</span>{item.title}</div>
                            <div className='g-mt30 g-f28'>
                                <span>充值金额:</span> <span className='g-fw g-f40'
                                                         style={{color: '#007AFF'}}>{item.total_fee}</span>
                            </div>
                            <div className='g-mt30 g-mb30 g-f28'><span>充值时间:</span>{item.processed_time}</div>
                        </div>)
                }
            </div>
        )
    }
    const toDeails =()=>{

        history.push(`/clientReview/soundRecord`,{
        })


    }

    const onFeedBackEnd = (event) => {
        if ( !hasMoreFeedBack ) {
            return;
        }
        setTimeout(() => {
            getSearchFeedBack(customerCrmId,feedbackPage,pagesize)
        }, 1000);
    };

    const onTriageEnd = (event) => {
        if ( !hasMoreTriage) {
            return;
        }
        setTimeout(() => {
            getSearchTriage(customerCrmId,triagePage,pagesize)
        }, 1000);
    };

    const onConsultInfoEnd = (event) => {
        if ( !hasMoreConsultInfo ) {
            return;
        }
        setTimeout(() => {
            getSearchConsultRecord(customerCrmId,consultType,consultInfoPage,pagesize)
        }, 1000);
    };

    const onBillTypeEnd = (event) => {
        if ( !hasMoreBillInfo ) {
            return;
        }
        setTimeout(() => {
            getCustomerBillInfo(customerCrmId,billInfoPage,pagesize)
        }, 1000);
    };

    return (
        <div className='user-details'>
            <div className='header-bg' ></div>
            <div  className='g-p10 details g-mt10 g-flex g-x-between'>
                <div className='item-left g-flex '>
                    <div className='g-flex-col g-y-center'>
                        <img className='avatar' src={baseInfo.sex=='1'?woman:man} alt=""/>
                        <img src={VIP} alt="" style={{width:'0.48rem',height:'0.3rem',marginTop:'0.1rem'}}/>
                    </div>
                    <div className='g-flex-col g-ml25'>
                        <div className='g-c-333 name' style={{'fontSize':'18px'}}>{baseInfo.customerName}</div>
                        {
                            ( baseInfo.tel||baseInfo.tel)&&(
                                <div className='g-c-333 g-f30  g-mt25'>{baseInfo.tel}</div>
                            )
                        }
                        <div className='g-c-999 g-f26 g-mt20'>卡号:<span className='g-ml15'>{baseInfo.mzcode}</span></div>
                        <div className='g-c-999 g-f26 g-mt20'>
                            所属咨询:<span className='g-ml15'>{baseInfo.xcname}</span>
                            <span className='g-ml15' style={{marginLeft:'1rem'}}>开发人:{baseInfo.dwname}</span>
                        </div>
                        <div className='g-c-999 g-f26 g-mt20'>登记时间:<span className='g-ml15'>{baseInfo.regist_date}</span></div>
                    </div>
                </div>
             </div>
            {
                baseInfo.myCustomer==1?(
                    <div className='tabs-wrapper g-mt16'>
                        <Tabs tabs={ [
                            { title: '详细资料', sub: '1' },
                            { title: '分诊记录', sub: '2' },
                            { title: '咨询情况', sub: '3' },
                            { title: '客户账单', sub: '4' },
                            { title: '回访记录', sub: '5' },


                        ]} tabBarUnderlineStyle={{width:'0.6rem',marginLeft:'0.52rem'}}
                              onChange={onTabClick}
                              swipeable={false}
                              initialPage={0}>
                            {/*详细资料*/}
                            <div className='g-pl25 g-pr25 g-flex-col g-c-333 g-f28'>
                                <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                                    <div>性别:</div>
                                    <div>{moreInfo.sex?(moreInfo.sex==0?'男':'女'):'未知'}</div>
                                </div>
                                <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                                    <div>年龄:</div>
                                    <div>{moreInfo.age?moreInfo.age:'未知'}</div>
                                </div>
                                <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                                    <div>生日:</div>
                                    <div>{moreInfo.birthday?moreInfo.birthday:'未知'}</div>
                                </div>
                                <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                                    <div>信息来源:</div>
                                    <div>{moreInfo.info_source?moreInfo.info_source:'未知'}</div>
                                </div>
                                <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                                    <div>区域来源:</div>
                                    <div>{moreInfo.area_info?moreInfo.area_info:'未知'}</div>
                                </div>
                                {(entryIsHome!=1&& isBind!=1)&&(
                                    <Button className='bind-customer-bt' type="primary"  onClick={() =>
                                        Modal.alert( '绑定客户信息', '确认绑定吗？', [
                                            { text: '取消'},
                                            { text: '确认', onPress: submit },
                                        ])
                                    }>立即绑定</Button>
                                )}
                            </div>
                            {/*分诊记录*/}
                            <div  className='visit-record g-flex-col g-pl30 g-pr30 '>
                                {
                                    triageInfo.length>0?(
                                        <ListView
                                            dataSource={dataSourceTriage}
                                            renderFooter={() => (<div style={{ padding: 30, textAlign: 'center' }}>
                                                {
                                                    !hasMoreTriage?'加载完毕，没有更多数据了~':('Loading...')
                                                }
                                            </div>)}
                                            renderRow={triageRow}
                                            useBodyScroll
                                            onEndReachedThreshold={100}
                                            onEndReached={onTriageEnd}
                                            pageSize={pagesize}
                                        />
                                    ):(
                                        <div>
                                            <img src={no_data} className='no-data' />
                                            <p className='g-f28 g-c-999  g-text-center'>暂无数据！</p>
                                        </div>
                                    )
                                }
                            </div>
                            {/*咨询情况*/}
                            <div className='visit-record  g-flex-col g-pl25 g-pr25'>
                                <div className='g-mt30 g-f18  g-flex g-y-center' style={{width:'100%'}}>
                                {/* onClick={selecConsult} */}
                                    <div   data-type='0'
                                         className={['consult-type',consultType=='0'?'select-type-active':'null'].join(' ') }  >全部</div>
                                    {/* <div onClick={selecConsult}  data-type='1'
                                         className={['consult-type','g-ml30',consultType=='1'?'select-type-active':'null'].join(' ') }>电网咨询</div>
                                    <div onClick={selecConsult}  data-type='2'
                                         className={['consult-type','g-ml30',consultType=='2'?'select-type-active':'null'].join(' ') } >现场咨询</div> */}

                                </div>
                                {
                                    consultInfo.length>0?(
                                        <ListView
                                            dataSource={dataSourceConsultInfo}
                                            renderFooter={() => (<div style={{ padding: 30, textAlign: 'center' }}>
                                                {
                                                    !hasMoreConsultInfo?'加载完毕，没有更多数据了~':('Loading...')
                                                }
                                            </div>)}
                                            renderRow={consultInfoRow}
                                            useBodyScroll
                                            onEndReachedThreshold={100}
                                            onEndReached={onConsultInfoEnd}
                                            pageSize={pagesize}
                                        />
                                    ):(
                                        <div>
                                            <img src={no_data} className='no-data' />
                                            <p className='g-f28 g-c-999  g-text-center'>暂无数据！</p>
                                        </div>
                                    )
                                }
                            </div>
                            {/*账单详情*/}
                            <div className='billinfo g-flex-col g-pl25 g-pr25' style={{paddingBottom:'1rem'}}>
                                <div className=' g-mb30 g-f18  g-flex g-y-center' style={{width:'100%'}}>
                                    <div className='g-mt30 g-f18  g-flex g-y-center' style={{width:'100%'}}>
                                        {/* onClick={selecBill} */}
                                        <div   data-type='0'
                                             className={['consult-type',billType=='0'?'select-type-active':'null'].join(' ') }  >全部</div>
                                        {/* <div onClick={selecBill}  data-type='1'
                                             className={['consult-type','g-ml30',billType=='1'?'select-type-active':'null'].join(' ') } >项目</div>
                                        <div onClick={selecBill}  data-type='2'
                                             className={['consult-type','g-ml30',billType=='2'?'select-type-active':'null'].join(' ') }>充值</div> */}
                                    </div>
                                </div>
                                {
                                    billInfo.length>0?(
                                        <div className="g-c-333 g-f28 ">
                                            <ListView
                                                dataSource={dataSourceBillInfo}
                                                renderFooter={() => (<div style={{ padding: 30, textAlign: 'center' }}>
                                                    {
                                                        !hasMoreBillInfo?'加载完毕，没有更多数据了~':('Loading...')
                                                    }
                                                </div>)}
                                                renderRow={billTypeRow}
                                                useBodyScroll
                                                onEndReachedThreshold={100}
                                                onEndReached={onBillTypeEnd}
                                                pageSize={pagesize}
                                            />
                                        </div>

                                    ):(
                                        <div>
                                            <img src={no_data} className='no-data' />
                                            <p className='g-f28 g-c-999  g-text-center'>暂无数据！</p>
                                        </div>

                                    )
                                }

                            </div>

                            {/*回访记录*/}
                            <div  className='visit-record g-flex-col g-pl30 g-pr30 '>
                                {
                                    feedbackInfo.length>0?(
                                        <ListView
                                            dataSource={dataSourceFeedBack}
                                            renderFooter={() => (<div style={{ padding: 30, textAlign: 'center' }}>
                                                {
                                                    !hasMoreFeedBack?'加载完毕，没有更多数据了~':('Loading...')
                                                }
                                            </div>)}
                                            renderRow={feedBackRow}
                                            useBodyScroll
                                            onEndReachedThreshold={100}
                                            onEndReached={onFeedBackEnd}
                                            pageSize={pagesize}
                                        />
                                        
                                    ):(
                                        <div>
                                            <img src={no_data} className='no-data' />
                                            <p className='g-f28 g-c-999  g-text-center'>暂无数据！</p>
                                        </div>
                                    )
                                }
                                {/* <div className='detailBtn'>
                                <Button color='primary'  onClick={toDeails.bind(this)}  style={{  border: '1px solid green',fontSize:'14px' ,height:'30px' ,lineHeight:'30px',width:'120px',color:"green" }}>查看回访</Button>
                                </div> */}

                                
                                
                                
                            </div>


                        </Tabs>
                    </div>
                ):(
                    <div className='g-mt20 g-pl25 g-pr25 g-flex-col g-c-333 g-f28'>
                        <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                            <div>性别:</div>
                            <div>{moreInfo.sex?(moreInfo.sex==0?'男':'女'):'未知'}</div>
                        </div>
                        <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                            <div>年龄:</div>
                            <div>{moreInfo.age?moreInfo.age:'未知'}</div>
                        </div>
                        <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                            <div>生日:</div>
                            <div>{moreInfo.birthday?moreInfo.birthday:'未知'}</div>
                        </div>
                        <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                            <div>信息来源:</div>
                            <div>{moreInfo.info_source?moreInfo.info_source:'未知'}</div>
                        </div>
                        <div className='g-border-bt1 g-flex g-x-between g-y-center' style={{height:'1.04rem'}}>
                            <div>区域来源:</div>
                            <div>{moreInfo.area_info?moreInfo.area_info:'未知'}</div>
                        </div>
                        {
                            (entryIsHome!=1 &&isBind!=1)&&(
                                <Button className='bind-customer-bt' type="primary"  onClick={() =>
                                    Modal.alert( '绑定客户信息', '确认绑定吗？', [
                                        { text: '取消'},
                                        { text: '确认', onPress: submit },
                                    ])
                                }>立即绑定</Button>
                            )
                        }

                    </div>
                )
            }
            <Header showHeader={showHeader}/>
            {tabIndex == 4 ? (
                <NewAdd customerCrmId={customerCrmId} customerName={baseInfo.customerName}/>
            ):(
                <div></div>
            )}
            

            
        </div>
    )
}
export default Details;